// 这种注释，在编译后不会出现在 CSS 文件上
/* 这种注释，编译后会出现在CSS文件上*/
@mySelector: #wrap;
@wrap: wrap;
@{mySelector} {
  color: red;
}
.@{wrap} {
  color: blue;
}
#@{wrap} {
  background-color: red;
}
@borderStyle: border-style;
@borderValue: solid;
.box {
  @{borderStyle}: @borderValue;
}

@images: '../img';
body {
  background: url('@{images}/dog.png')
}
@border: 1px solid red;
div {
  border: @border;
}
@backColor: {background-color: red;}
div {
  @backColor();
}

@var: @a;
@a: 100%;
#wrap {
  width: @var;
  @a: 9%;
}
.container {
  width: 200px;
  height: 100px;
  background-color: red;
  .box {
    width: 100px;
    height: 100px;
    background-color: aliceblue;
    .ul {
      width: 50px;
      height: 50px;
      background-color: skyblue;
    }
  }

}
#main {
  & .show {
    display: block;
  }
}
.show {
  display: none;
}